<template>
  <!-- 每日游戏记录 -->
  <div class="app-container">
    <div class="app-wrap" style="height: 100%;">
      <search-table ref="table" :table-loading="listLoading" :table-data="gameDataList" @query="getGameList(true)" @reset="refresh">
        <template v-slot:row>
          <el-form-item label="游戏类型:" label-width="80px">
            <el-select v-model="listQuery.game_id" placeholder="请选择游戏类型" filterable >
              <el-option label="全部" :value="-1"/>
              <el-option :label="item.label" :value="item.value" v-for="(item, index) in GAME_TYPE" :key="index" />
            </el-select>
          </el-form-item>
          <el-form-item label="日期时间:" label-width="80px">
            <el-date-picker is-range v-model="listQuery.dateTime" type="date" :clearable="false" class="full-width-input time-box"></el-date-picker>
          </el-form-item>
          <el-form-item label="用户ID:" label-width="60px">
            <el-input type="number" v-model="listQuery.user_id" clearable placeholder="请输入用户ID" />
          </el-form-item>
        </template>
        <template v-slot:actions >
          <div class="statistic flexDetween">
            <div class="flex">
              <el-button type="info" size="mini" icon="el-icon-refresh" @click="refresh">刷新</el-button> 
              <div class="flex marginL20 border-total">
                <p> 总下注：<span class="colorGre">{{ statisticalData.bet_money }}</span></p>
                <p> 总流水：<span class="colorGre">{{ statisticalData.water_money }}</span></p>
                <p> 系统总输赢：<span :class="statisticalData.game_income>0?'colorGre':'colorRed'">{{ statisticalData.game_income }}</span></p>
                <p> 总抽水：<span class="colorGre">{{ statisticalData.game_tax }}</span></p>
              </div>
            </div>
            <!-- <el-button type="primary" size="mini" icon="el-icon-download" :disabled="!gameDataList.length" @click="getExport">导出</el-button>  -->
          </div>
        </template>
        <template>
          <el-table-column prop="group_time" label="日期" align="center" width="180"/>
          <el-table-column align="center" prop="game_id" label="游戏类型" width="120">
            <template slot-scope="scope">
              <span>{{ gameType(scope.row.game_id) }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="user_id" label="用户ID" align="center" width="120"/>
          <el-table-column prop="nick_name" label="用户昵称" align="center" width="150" show-overflow-tooltip/>
          <el-table-column prop="game_num" label="游戏局数" align="center" width="180"/>
          <el-table-column prop="bet_money" label="下注额" align="center" />
          <el-table-column prop="game_tax" label="抽水" align="center" />
          <el-table-column prop="water_money" label="流水" align="center"/>
          <el-table-column prop="game_income" label="系统输赢" align="center">
            <template slot-scope="scope">
              <span :class="scope.row.game_income>0?'colorGre':'colorRed'">{{ scope.row.game_income }}</span>
            </template>
          </el-table-column>
        </template>
        <template v-slot:footer>
          <pagination  :total="currentTotal" :page.sync="listQuery.page" :limit.sync="listQuery.size" @pagination="getGameList" />
        </template>
      </search-table>
    </div>
  </div>
</template>

<script>
import { throttle } from '@/utils/index'
import {
  getSumDailyGame,
  getDailyGame
} from '@/api/player'
import {
  GAME_TYPE,
  GAME_CURRENCY_TYPE
} from '@/utils/enum'
import SearchTable from '@/components/SearchTable'
export default {
  name: 'dailyGame',
  components: {
    SearchTable
  },
  data () {
    return {
      GAME_TYPE,
      GAME_CURRENCY_TYPE,
      isShowDetails: false,
      checkedItem: null,
      listLoading: true,
      gameDataList: [],
      statisticalData:{
        bet_money: 0, // 总下注
        water_money: 0,// 总流水
        game_income: 0,// 总输赢
        game_tax: 0,// 总税收
      },
      listQuery: {
        page: 1,
        size: 50,
        game_id: -1,
        is_cash_mode: -1,
        is_recharge: -1,
        is_a_mode: -1,
        kill_type: -1,
        user_id: '',
        game_number: '',
        dateTime: this.$public.getDateDay(0),
        start_time: '',
        end_time: '',
      },
      currentTotal: 0,
      pathDataList: [],
    }
  },
  created () {},
  activated () {
    this.getGameList();
  },
  methods: {
    // 查询
    async getGameList (query) {
      let that = this,params=that.listQuery;
      if(query && !query.page){
        params.page=1
        params.size=50
      }
      that.gameDataList = [];
      that.checkedItem = null;
      params.start_time = that.$public.standardDate(params.dateTime).substr(0,10)+' 00:00:00'
      params.end_time = that.$public.standardDate(params.dateTime).substr(0,10)+' 23:59:59'
      const response = await getDailyGame(params)
      if (response.code == 1) {
        if (response.data.list) {
          response.data.list.forEach(item=>{
            item.group_time = item.group_time.substring(0,10)
            item.bet_money=that.$public.mathNumberDivideWan(item.bet_money)
            item.game_tax=that.$public.mathNumberDivideWan(item.game_tax)
            item.water_money=that.$public.mathNumberDivideWan(item.water_money)
            item.game_income=that.$public.mathNumberDivideWan(item.game_income)*-1
          })
          that.gameDataList = response.data.list
          that.currentTotal = response.data.total
        }
      }else{
        that.$message.error(response.msg)
      }
      that.getStatistical()
      that.listLoading = false
    },
    // 统计数据
    getStatistical(){
      let that = this;
      getSumDailyGame(that.listQuery).then(res => {
        if (res.code == 1) {
          res.data.bet_money=that.$public.mathNumberDivideWan(res.data.bet_money)
          res.data.water_money=that.$public.mathNumberDivideWan(res.data.water_money)
          res.data.game_income=that.$public.mathNumberDivideWan(res.data.game_income)*-1
          res.data.game_tax=that.$public.mathNumberDivideWan(res.data.game_tax)
          that.statisticalData=res.data
        }
      }).catch((error) => {
        that.$message.error(error.msg)
      })
    },
    // 游戏类型展示
    gameType(cellValue){
      return (this.GAME_TYPE.find((item) => item.value === cellValue)?.label || "-");
    },
    // 货币类型
    amountType(cellValue){
      return (this.GAME_CURRENCY_TYPE.find((item) => item.value === cellValue)?.label || "-");
    },
    // 导出
    getExport(){
      let that = this;
      getDailyGameExport(that.listQuery).then(res => {
        if (res.code == 1) {
          that.$public.documentDownload(res.data)
        }
      }).catch((error) => {
        that.$message.error(error.msg)
      })
    },
    // 刷新
    refresh: throttle(function () {
      this.listQuery = {
        page: 1,
        size: 50,
        game_id: -1,
        is_cash_mode: -1,
        is_recharge: -1,
        is_a_mode: -1,
        kill_type: -1,
        user_id: '',
        game_number: '',
        dateTime: this.$public.getDateDay(0),
        start_time: '',
        end_time: '',
      },
      this.getGameList();
      this.getStatistical()
    }, 2000),
  }
}
</script>

<style lang="scss" scoped>
.border-total{
  padding: 0 20px;
  background-color: #F9F9F9;
}
</style>
